Skip to content

Add touch feedback effect on background - #16

Open
wannerdev wants to merge 1 commit into
mainfrom
feature/touch-feedback-effect
Open

Add touch feedback effect on background#16
wannerdev wants to merge 1 commit into
mainfrom
feature/touch-feedback-effect

Conversation

@wannerdev

Copy link
Copy Markdown
Owner

Description

Adds visual feedback when users touch the screen on mobile devices, creating an expanding ripple effect at the touch point.

Changes

  • Created new touch_feedback module in effects
  • Implemented TouchFeedback component for animation state
  • Added spawn_touch_feedback system to create effects on touch
  • Added update_touch_feedback system to animate and render effects
  • Expanding circle ripple effect (2.0 to 10.0 radius)
  • Fades out over 0.5 seconds with quadratic easing
  • Converts screen position to world position for accurate placement
  • Automatic entity cleanup after animation completes
  • Integrated into effects plugin system

Visual Effect Details

  • Trigger: TouchPhase::Started (when finger touches screen)
  • Color: Cyan/blue (RGB: 0.3, 0.9, 1.0)
  • Animation: Expanding circle from 2.0 to 10.0 radius
  • Duration: 0.5 seconds
  • Fade: Quadratic fade-out (alpha: 0.7 to 0.0)
  • Position: World space at touch location

Behavior

  • Spawns: On every touch start event
  • Animates: Expands and fades simultaneously
  • Despawns: Automatically after 0.5 seconds
  • Performance: Minimal impact, entities cleaned up automatically
  • Mobile-specific: Only triggers on touch input

Benefits

  • Provides immediate visual feedback for touch input
  • Helps users confirm their touches are registered
  • Enhances mobile user experience
  • Makes touch interactions feel more responsive
  • Adds polish and game feel to mobile version
  • Helps with touch accuracy awareness

Technical Implementation

  • Uses Bevy's touch input event system
  • Converts viewport coordinates to world coordinates
  • Uses gizmos for efficient rendering
  • Component-based animation with time tracking
  • Automatic entity lifecycle management
  • Integrated into GameplaySystem set

Performance

  • Lightweight: Only spawns on touch events
  • Efficient: Uses gizmos (no sprites/meshes)
  • Clean: Automatic despawn prevents entity buildup
  • Minimal: Simple circle rendering
  • Scalable: Works with multiple simultaneous touches

Testing

  • Touch screen on mobile device
  • Verify cyan ripple appears at touch point
  • Check that ripple expands and fades smoothly
  • Confirm automatic cleanup (no entity buildup)
  • Test with multiple simultaneous touches
  • Verify no performance impact

Related Issue

Fixes: Android/Mobile Feedback - Touch creates some feedback, an effect on touching the background (mobile)

- Created new touch_feedback module
- Implemented expanding circle ripple effect on touch
- Spawns visual feedback on TouchPhase::Started
- Cyan/blue expanding circle (2.0 to 10.0 radius)
- Fades out over 0.5 seconds
- Converts screen position to world position
- Automatic cleanup after animation
- Provides tactile visual feedback for mobile users
- Integrated into effects plugin system
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant